<template>
    <uni-data-picker class="st-uni-data-picker" :localdata="localData" v-model="model" :popup-title="popupTitle"
                     @nodeclick="nodeClick" @change="change" @popupclosed="popupclosed"></uni-data-picker>
</template>

<script>
    export default {
        name: 'StUniDataPicker',
        props: {
            items: {
                type: Array,
                default: function () {
                    return []
                }
            },
            selectAll: {
                default: true
            },
            type: {
                default: null
            },
            popupTitle: {
                default: '请选择'
            },
            value: {
                default: null
            }
        },
        data() {
            return {
                localData: [],
                temModel: null,
                model: null
            }
        },
        onLoad() {
        },
        created() {
            let type = this.type
            if (type === 'area') {
                //this.localData = this.$utils.array2Tree(this.$utils.areas)
                this.loadAreaData(type)
            } else if (type === 'isHas') {
                this.localData = [{
                    text: '有',
                    value: 1
                }, {
                    text: '没有',
                    value: 0
                }]
            } else if (type === 'isYesNo') {
                this.localData = [{
                    text: '是',
                    value: 1
                }, {
                    text: '否',
                    value: 0
                }]
            } else if (type) {
                this.loadDictData(type)
            } else {
                this.localData = this.items
            }
            this.model = this.getVal(this.value)
        },
        methods: {
            async loadDictData(code) {
                let dict = uni.getStorageSync('dict_' + code)
                if (!dict) {
                    const {data: res} = await this.$http.get('/dict/app/getItems?groupCode=' + code)
                    dict = res || []
                    if (dict && dict.length > 0) {
                        uni.setStorageSync('dict_' + code, dict)
                    }
                }
                this.localData = this.$utils.array2Tree(dict)
            },
            async loadAreaData(code) {
                let dict = uni.getStorageSync('dict_app_' + code)
                if (!dict) {
                    const {data: res} = await this.$http.get('/area/app/getList?levelMin=1')
                    dict = res || []
                    if (dict && dict.length > 0) {
                        uni.setStorageSync('dict_app_' + code, dict)
                    }
                }
                this.localData = this.$utils.array2Tree(dict)
            },
            getVal(val) {
                if (typeof val === 'boolean') {
                    return val ? 1 : 0
                }
                return val
            },
            change(e) {
                console.log('change', e);
                this.$emit('input', this.model)
                this.$emit('change', e)
            },
            nodeClick(e) {
                this.temModel = e.value
                this.$emit('nodeclick', e)
            },
            popupclosed(e){
                if(!this.selectAll){
                    this.model = this.temModel|| this.model
                }
                console.log('popupclosed', this.model);
                this.$emit('input', this.model)
                this.$emit('popupclosed', e)
            }
        },
        watch: {
            value(val) {
                this.model = this.getVal(val)
            }
        }
    }
</script>

<style>

    .uni-data-tree .selected-area .selected-item .selected-list {
        line-height: 38px !important;
    }
</style>
